<template>
  <div id="modal">
    <Modal v-model="isOpening" title="微信打赏我吧!" :closable="false" :mask-closable="false" >
      <div class="detail-modal">
        <div class="reward-title-modal">感谢你的支持，我会继续努力！</div>
        <img src="../assets/qrcode.jpg" style="width: 200px;height: 200px;" alt="赞助我吧">
        <h2>扫码打赏，建议金额 1-10 元</h2>
      </div>
      <div slot="footer">
        <Button type="success" size="large" long @click="closeModel">谢谢您的支持！</Button>
      </div>
    </Modal>
  </div>
</template>
<script>
  export default{
    props: ['isOpen'],
    data () {
      return {}
    },
    computed: {
      isOpening () {
        return this.isOpen
      }
    },
    methods: {
      closeModel () {
        this.$emit('closeModel', false)
      }
    }
  }
</script>

<style lang="stylus" scoped>
  .detail-modal {
    text-align: center;
    .reward-title-modal {
      height: 80px;
      background url("../assets/reward-tittle-bg.jpg") no-repeat center;
      background-size 100%;
      line-height: 80px;
      font-size 15px;
      color: #aaa;
    }
  }
</style>
